<template>
	<div>
		<head-top></head-top>
		<div class="col-sm-12 dash_header">
			<div class="dash_header_con">
				<div class="col-sm-1">
					<img src="../assets/img/dashboard.svg" alt="img" />
				</div>
				<div class="col-sm-8">
					<h5 class="text-left">一切源于数据。请点击右侧按钮上传你的数据。</h5>
					<p class="text-left dash_header_des">所有数据默认只有上传者可见。你可以使用数据进行AI智能建模，数据预测和数据基本分析。</p>
				</div>
				<div class="col-sm-3">
					<p class="to_upload_data"><router-link :to="{name:'uploadData'}">上传数据</router-link></p>
				</div>
			</div>
		</div>
		<div class="boxWrap col-sm-12">			
			<div class="dashboard">
				<div class="text-left">
					<div class="col-sm-3 per_lable_title">
						<p class="col-sm-6" @click="changeTab(1)">我的数据<span :class="{'is_active':isTab1}"></span></p>
						<p class="col-sm-6" @click="changeTab(2)" style="border-right:0;">我的模型<span :class="{'is_active':isTab2}"></span></p>
					</div>
					<all-data v-show="dataSeen" :owner="owner_val"></all-data>
					<model-template :owner="owner_val" v-show="templatesSeen"></model-template>
					<!--job列表-->
					<p class="text-left job_list">我的计算任务</p>
					<all-jobs></all-jobs>	
					
				</div>
			</div>
		</div>		
		<!--这是测试页面-->
		<!--<router-link :to="{name:'Table'}">toTable</router-link>-->
		<footerHtml></footerHtml>
		<!--遮罩层和loading-->
		<div id="mask" v-show="seen" :style="{height: relHeight}"></div>
		<img src="../assets/img/loading.gif" alt="loading" class="loading_img" v-if="loading"/>
	</div>
	
</template>

<script>
	//引入公共模块
	import headTop from '@/components/headTop'
	import footerHtml from '@/components/footerHtml'
	import allData from '@/components/allData'
	import allTemplates from '@/components/allTemplates'
	import allJobs from '@/components/allJobs'
	import allModel from '@/components/allModel'
	import modelTemplate from '@/components/model_template'
	
	export default {
		components:{
			headTop,
			footerHtml,
			allData,
			allTemplates,
			allJobs,
			allModel,
			modelTemplate
		},
		data(){
            return {
            	owner_val:0,
            	token:localStorage.getItem('token'),
        		templatesSeen:false,
        		dataSeen:true,
        		isTab1:true,
	    		isTab2:false,
	    		seen:false,
    			loading:false,
    			relHeight:''
            }
        },		
	    created(){
	    	this.relHeight=`${document.documentElement.scrollHeight}px`;
	    	this.seen=true;
	    	this.loading=true;
	    },
	    beforeCreate:function(){
	    	this.$nextTick(function () {
		      this.seen=false;
		      this.loading=false;
		    })
	    },
		methods:{
			changeTab(tab_type){
	    		//1我的数据，2是我的算法
	    		this.tab_type=tab_type;
	    		if(this.tab_type==1){
	    			this.isTab1=true;
	    			this.isTab2=false;
	    			this.dataSeen=true;
	    			this.templatesSeen=false;
	    		}else if(this.tab_type==2){
	    			this.isTab1=false;
	    			this.isTab2=true;
	    			this.templatesSeen=true;
	    			this.dataSeen=false;
	    		}
	    	}
			
		}
	}
	
	//document.title="dashboard"
</script>

<style lang="css">
	@import "../assets/css/base.css"
</style>
<style lang="css">
	@import "../assets/css/dashboard.css"
</style>
